@import "./theme";

// color system
// 2018.02.27

$fc1: (
  100: #293140,
  200: #515b6b,
  300: #858c99,
  400: #aeb4bd,
);

$fc2: (
  100: #262626,
  200: #595959,
  300: #999,
  400: #bfbfbf,
);

$bc1: (
  100: #e0e6ed,
  200: #e8edf2,
  300: #f1f4f7,
  400: #f7f9fa,
);

$bc2: (
  100: #fafafa,
  200: #f2f2f2,
  300: #ebebeb,
  400: #e5e5e5,
);

$warn-color: (
  dark: #246bb3,
  blue: #2ea2f8,
  green: #4cb540,
  yellow: #ffbf00,
  orange: #f49400,
  red: #f05455
);


// theme
$color-white: #fff;

$color-primary: #2e7ef2;

$color-error: map_get($warn-color, red);


$color-blue: map_get($warn-color, blue);
$color-green: map_get($warn-color, green);
$color-yellow: map_get($warn-color, yellow);
$color-orange: map_get($warn-color, orange);
$color-red: map_get($warn-color, red);



// border
$color-border: map_get($bc1, 100);

$color-border-focus: map_get($warn-color, blue);

// text
$color-text: map_get($fc2, 100);

$color-text-dark: map_get($fc2, 100);

$color-text-gray: map_get($fc1, 300);

$color-text-disabled: map_get($fc1, 400);

// special
$color-text-warn: map_get($warn-color, red);

$color-text-link: map_get($warn-color, dark);

// background
$background-gray: map_get($bc1, 400);

$background-gray-hover: map_get($bc1, 300);

$background-slider: map_get($bc1, 200);


// font
$font-size-small: 12px;

$font-size-normal: 14px;

$font-size-large: 16px;

$font-family: "Helvetica Neue", Helvetica, Tahoma, Arial, "PingFang SC", "Microsoft YaHei", sans-serif;


// radius
$radius-normal: 4px;

$radius-small: 3px;

$radius-mini: 2px;


// shadow

$shadow: 0 1px 4px 0 $color-text-disabled;